<!-- 主要的文档内容和文档功能 -->
<template>
  <div class="secondContent ieCompatible">
    <!-- 头部的第二级功能菜单 -->
    <div class="secondMenu">
      <div
        v-for="(item, index) in isMenu.menuData"
        :key="index"
        :style="item.status?'cursor: pointer;':''"
        @click="menuClick(item, checkNow)"
        class="menu ml-20 ieCompatible"
      >
        <i
          :class="[item.icon, item.status ? 'enuTrue':'enuFalse']"
          class="jeicon"
        />
        <span :class="item.status ? 'enuTrue':'enuFalse'">{{ item.text }}</span>
      </div>
    </div>
    <!-- 全部文件的显示,这边的逻辑是 没有nodeId，说明是根目录，那面包屑就不需要显示，反之则反-->
    <div
      v-loading="loadingMain"
      class="documents"
    >
      <div
        v-if="nodeId && breakShow"
        class="ml-20 font12 breadCrumb"
      >
        <!-- 如果breadItem.id == no 说明面包屑显示的是... -->
        <div
          v-for="(breadItem, index) in breadCrumbHint"
          :key="index"
          @click="clickBreadItem(breadItem, index)"
          v-bind:class="[breadCrumbHint.length == index + 1 && 'bread-color', breadItem.id != 'no' && 'cursorTrue enuTrue']"
          class="bread"
        >
          <el-tooltip
            v-if="index > 1 && breadItem.name.length > 5"
            :content="breadItem.name"
            effect="dark"
            placement="bottom-start"
          >
            <span>{{ breadItem.changename }}</span>
          </el-tooltip>
          <span v-else>{{ breadItem.changename }}</span>
          <span
            v-if="breadItem.id != '1' && index < breadCrumbHint.length - 1"
            class="enuFalse"
          > > </span>
          <div
            v-if="index == 0 && breadItem.id == '1'"
            class="borderDiv borderR"
          />
        </div>
      </div>
      <!-- 自定义文件内容的组件 -->
      <div class="main">
        <!-- 正常顺序排列的样式 -->
        <div v-if="isMenu.rectangleIcon == 'jeicon-product-list'">
          <!-- 文件表格的头部 -->
          <div class="docTitle">
            <el-row>
              <div
                v-for="(title, titleIndex) in isMenu.listTitle"
                :key="titleIndex"
              >
                <el-col :span="title.span">
                  <div
                    v-if="titleIndex == 0"
                    class="inline_block"
                  >
                    <el-checkbox
                      :indeterminate="isIndeterminate"
                      v-model="checkAll"
                      @change="checkAllDoc"
                    />
                  </div>
                  <div
                    class="inline_block"
                  >
                    <span class="ml-10">{{ title.text }}</span>
                    <i
                      @click.stop="clickTitle(title)"
                      v-if="title.icon"
                      class="el-icon-d-caret ml-10 cursorTrue"
                    />
                  </div>
                </el-col>
              </div>
            </el-row>
          </div>
          <!-- 文件表格的主要内容 -->
          <div
            :class="breadCrumbArr && breadCrumbArr.length > 2?'docContentNoGen':'docContentGen'"
            class="docContent"
          >
            <!-- 如果没有数据就显示暂无数据的icon标签 -->
            <div
              v-if="mainList && mainList.length == 0"
              class="noMainList"
            >
              <div class="mainNoData">
                <!-- <i class="jeicon jeicon-no-date mainIcon grayColor" /> -->

                <img
                  src="../../assets/nodata.png"
                  alt=""
                >
                <div class="font20 grayColor">
                  暂无数据
                </div>
              </div>
            </div>
            <div
              @mouseenter="backgroundRow(list, indexList)"
              v-for="(list, indexList) in mainList"
              @dblclick="docClick(list)"
              :key="indexList"
            >
              <el-row
                :class="list.backgroundCheck ? 'docRowBg':''"
                class="docRow"
              >
                <!-- 文件名 -->
                <el-col :span="10">
                  <el-row
                    type="flex"
                    justify="start"
                  >
                    <el-col :span="18">
                      <el-checkbox
                        @change="checkList(list, indexList)"
                        v-model="list.checkbox"
                        :disabled="['check'].includes(list.roleRoleCode)"
                      />
                      <i
                        :class="[list.icon.icon]"
                        :style="`color:${list.icon.color}`"
                        class="ml-10 jeicon font25 lineMiddle mr-10"
                      />
                      <div
                        v-for="(checkDoc, check_indexDoc) in list.checkTag"
                        :key="check_indexDoc"
                        class="inline_block"
                      >
                        <div
                          v-show="checkDoc.check"
                          :style="`background:${checkDoc.color}`"
                          class="docTage"
                        />
                      </div>

                      <div
                        v-if="!list.transferAddress"
                        @click="previewClick(list)"
                        class="ml-10 textOmit width50"
                      >
                        <div
                          :class="searchInput && 'linh-20'"
                          style="text-overflow: ellipsis;overflow: hidden;"
                        >
                          {{ list.name }}
                        </div>
                        <div
                          v-if="searchInput"
                          class="linh-20 enuFalse"
                        >
                          {{ list.parentPathName }}
                        </div>
                      </div>

                      <el-tooltip
                        v-if="list.shareStatus == 'delete'"
                        :content="'源文件已被删除'"
                        effect="dark"
                        placement="top-end"
                      >
                        <span class="ml-10 font12 grayColor">
                          已被删除
                        </span>
                      </el-tooltip>
                      <!-- <span
                        v-if="list.shareStatus == 'delete'"
                        class="grayColor font12"
                      >源文件已被删除</span> -->
                      <!-- 我收到分享转存之后的目录地址回显显示 -->
                      <el-tooltip
                        v-if="list.transferAddress"
                        :content="list.name"
                        effect="dark"
                        placement="top-end"
                      >
                        <span class="ml-10 font16 textOmit width30">
                          {{ list.name }}
                        </span>
                      </el-tooltip>
                      <!-- 我收到分享转存之后的目录地址回显显示 -->
                      <el-tooltip
                        v-if="list.transferAddress"
                        :content="list.transferAddress"
                        effect="dark"
                        placement="bottom-start"
                      >
                        <span class="ml-10 font12 textOmit width30 grayColor">
                          已转存
                          ({{ list.transferAddress }})
                        </span>
                      </el-tooltip>
                    </el-col>
                    <!-- 文件的操作分享的功能 -->
                    <el-col :span="6">
                      <div v-if="list.backgroundCheck && list.docFunc">
                        <el-row
                          type="flex"
                          justify="end"
                        >
                          <el-col
                            :span="4"
                            v-for="(item, index) in list.docFunc"
                            :key="index"
                            class="docShow dropdownIconDisplay"
                          >
                            <el-tooltip
                              :transition="''"
                              :offset="-5"
                              :content="item.name"
                              effect="dark"
                              placement="top-end"
                            >
                              <div
                                class="ieHeight"
                              >
                                <i
                                  @click.stop="listIconClick(item, list)"
                                  v-if="!['jeicon-more','jeicon-label'].includes(item.icon)"
                                  :class="item.icon"
                                  class="jeicon font10 enuTrue"
                                />
                              </div>
                            </el-tooltip>
                            <!-- 文件功能的下拉菜单 -->
                            <el-dropdown
                              v-if="item.icon == 'jeicon-more'"
                              @command="changeAList"
                              trigger="click"
                              class="downIcon30 dropdownIcon"
                            >
                              <el-tooltip
                                :transition="''"
                                :offset="-5"
                                :content="item.name"
                                effect="dark"
                                placement="top-end"
                              >
                                <span>
                                  <i
                                    :class="item.icon"
                                    class="jeicon font10 enuTrue"
                                  />
                                </span>
                              </el-tooltip>
                              <el-dropdown-menu slot="dropdown">
                                <el-dropdown-item :command="{status:'copy',data: list}">
                                  复制
                                </el-dropdown-item>
                                <el-dropdown-item :command="{status:'move',data: list}">
                                  移动到
                                </el-dropdown-item>
                                <el-dropdown-item
                                  v-if="list.type"
                                  :command="{status:'mail',data: list}"
                                >
                                  至微邮
                                </el-dropdown-item>
                                <el-dropdown-item :command="{status:'remove',data: list}">
                                  删除
                                </el-dropdown-item>
                              </el-dropdown-menu>
                            </el-dropdown>
                            <!-- 文件标签的功能 -->
                            <el-tooltip
                              v-if="item.icon == 'jeicon-label'"
                              placement="right"
                              effect="light"
                            >
                              <div
                                slot="content"
                                class="checkTool"
                              >
                                <!-- 每个文件的标签 -->
                                <div
                                  v-for="(check, check_index) in list.checkTag"
                                  :key="check_index"
                                  :style="`background:${check.color}`"
                                  @click="docTagChange(check, check_index, list, indexList)"
                                  class="checkTage"
                                >
                                  <span
                                    v-if="check.check"
                                    class="checkTrue"
                                  >√</span>
                                </div>
                              </div>
                              <i
                                :class="item.icon"
                                class="jeicon font10 enuTrue"
                              />
                            </el-tooltip>
                          </el-col>
                        </el-row>
                      </div>
                    </el-col>
                  </el-row>
                </el-col>
                <!-- 大小 -->
                <el-col :span="isMenu.router == '1-1'?4:4">
                  <span class="font12">{{ !list.size ?'-':list.size }}</span>
                </el-col>
                <!-- 创建人、上传目录、（传输记录）状态 -->
                <!-- list.recycleStatus 判断是否点击的回收站 -->
                <el-col
                  v-if="!list.recycleStatus"
                  :span="isMenu.router == '1-1'?3:4"
                >
                  <!-- 判断是否是传输记录 -->
                  <span
                    v-if="!list.transfer"
                    class="font12"
                  >
                    <el-tooltip
                      v-if="list.uploadData"
                      :content="list.docSrc"
                      effect="dark"
                      placement="bottom-start"
                    >
                      <span class="ml-10 font12 width30 textOmit grayColor">
                        {{ list.docSrc }}
                      </span>
                    </el-tooltip>
                    <!-- 上传目录的文件地址 -->
                    <span v-else>{{ list.createUser }}</span>
                    <!-- 分享给他人的人员显示 -->
                    <span
                      v-if="list.shareInName && list.backgroundCheck"
                      @click="shargeOther(list.shareInName)"
                      class="enuTrue ml-10 font10 textOmit width50 lineMiddle"
                    >分享至 {{ list.shareInName }}</span>
                  </span>
                  <!-- 传输记录的状态 -->
                  <div v-if="list.statusText">
                    <i
                      :class="[list.uploadStatus == 'success'? 'enuTrue' : 'redColor', list.transferType == 'upload'? 'jeicon-arrow-up' : 'jeicon-arrow-down',]"
                      class="jeicon font10"
                    />
                    <span>{{ list.statusText }}</span>
                  </div>
                </el-col>
                <!-- 修改时间、上传状态 -->
                <el-col :span="isMenu.router == '1-1'?4:5">
                  <span
                    v-if="!list.uploadData"
                    class="font12"
                  >{{ list.uploadTime }}</span>
                  <div v-else>
                    <div class="progressMain">
                      <!-- 进度条上方的百分比显示 -->
                      <div class="textProgress">
                        {{ list.uploadIssue == 'ok'?`${list.uploadStatus}%`:'' }}
                      </div>
                      <el-progress
                        :show-text="false"
                        :percentage="list.uploadStatus"
                        :color="list.uploadStatus>0?'#54C24D':''"
                      />
                      <!-- 进度条下方的网络链接失败 和 暂停 -->
                      <div class="textProgress">
                        <span
                          v-if="list.uploadIssue == 'error'"
                          class="font10 redColor"
                        >暂无网络，传输失败</span>
                        <span
                          v-if="list.uploadIssue == 'stop'"
                          class="font10 grayColor"
                        >已暂停</span>
                      </div>
                    </div>
                  </div>
                </el-col>
                <el-col
                  :span="3"
                  v-if="isMenu.router == '1-1'"
                >
                  <div v-if="!list.operation.icon">
                    <span
                      v-for="(textData, textIndex) in list.operation.text"
                      :key="textIndex"
                      :class="[textIndex != 0?'ml-10':'', textData.title != '无' && 'enuTrue cursorTrue']"
                      @click.stop="companySet(textData, list)"
                      class="font12"
                    >{{ textData.title || '-' }}</span>
                  </div>
                  <i
                    v-else
                    :class="list.operation.icon"
                    class="jeicon font12 cursorTrue"
                  />
                </el-col>
              </el-row>
            </div>
          </div>
        </div>
        <!-- 矩形排列的样式 -->
        <div v-else>
          <div class="docTitle">
            <el-row>
              <div
                v-for="(title, titleIndex) in isMenu.listTitle"
                :key="titleIndex"
              >
                <el-col
                  v-if="titleIndex == 0"
                  :span="title.span"
                >
                  <div>
                    <el-checkbox
                      :indeterminate="isIndeterminate"
                      v-model="checkAll"
                      @change="checkAllDoc"
                    />
                    <span class="ml-10">{{ title.text }}</span>
                    <i
                      v-if="title.icon"
                      class="el-icon-d-caret ml-10 cursorTrue"
                    />
                  </div>
                </el-col>
              </div>
            </el-row>
          </div>
          <!-- 文件表格的主要内容 -->
          <div
            :class="breadCrumbArr && breadCrumbArr.length > 2?'docContentNoGen':'docContentGen'"
            class="docContent"
          >
            <!-- 如果没有数据就显示暂无数据的icon标签 -->
            <div
              v-if="mainList && mainList.length == 0"
              class="noMainList"
            >
              <div class="mainNoData">
                <!-- <i class="jeicon jeicon-no-date mainIcon grayColor" /> -->

                <img
                  src="../../assets/nodata.png"
                  alt=""
                >
                <div class="font20 grayColor">
                  暂无数据
                </div>
              </div>
            </div>
            <div
              :gutter="20"
              class="rectangle"
            >
              <div
                v-for="(list, indexList) in mainList"
                :key="indexList"
                :span="3"
                @dblclick.stop="docClick(list)"
                class="rectangleList"
              >
                <div
                  @mouseenter="backgroundRow(list, indexList)"
                  class="rectangleConent"
                >
                  <el-card shadow="hover">
                    <el-row>
                      <el-col
                        :span="3"
                        class="linHeight0"
                      >
                        <el-checkbox
                          @change="checkList(list, indexList)"
                          v-model="list.checkbox"
                        />
                      </el-col>
                      <el-col :span="18">
                        <div
                          @click.stop="previewClick(list)"
                          class="textCenter"
                        >
                          <div
                            v-if="!list.icon.url"
                            class="imgIconSize60 inline_block"
                          >
                            <i
                              :class="[list.icon.icon]"
                              :style="`color:${list.icon.color}`"
                              class="ml-10 jeicon font40 lineMiddle"
                            />
                          </div>
                          <img
                            v-else
                            :src="list.icon.url"
                            alt=""
                            class="lineMiddle imgIconSize60 mr-10 ml-10"
                          >
                        </div>
                      </el-col>
                      <el-col
                        v-if="list.backgroundCheck && ['1-1', '1-2'].includes(isMenu.router)"
                        :span="3"
                        class="linHeight0"
                      >
                        <el-dropdown
                          @command="changeAList"
                          trigger="click"
                          class="downIcon10 dropdownIcon"
                          placement="bottom-end"
                        >
                          <span>
                            <el-tooltip
                              :transition="''"
                              :offset="-5"
                              :content="'更多'"
                              effect="dark"
                              placement="top-end"
                            >
                              <i class="jeicon jeicon-more enuTrue font12" />
                            </el-tooltip>
                          </span>
                          <el-dropdown-menu slot="dropdown">
                            <el-dropdown-item :command="{status:'copy',data: list}">
                              复制
                            </el-dropdown-item>
                            <el-dropdown-item :command="{status:'move',data: list}">
                              移动到
                            </el-dropdown-item>
                            <el-dropdown-item
                              v-if="list.type"
                              :command="{status:'mail',data: list}"
                            >
                              至微邮
                            </el-dropdown-item>
                            <el-dropdown-item :command="{status:'remove',data: list}">
                              删除
                            </el-dropdown-item>
                          </el-dropdown-menu>
                        </el-dropdown>
                      </el-col>
                    </el-row>
                    <!-- 每个文件的名字和标签 -->
                    <div class="docName textAll">
                      <span class="font13 textOmit textCenter">{{ list.name }}</span>
                      <!-- 圆环的显示 -->
                      <div class="docRead">
                        <div
                          v-for="(checkDoc, check_indexDoc) in list.checkTag"
                          :key="check_indexDoc"
                          class="inline_block"
                        >
                          <div
                            v-show="checkDoc.check"
                            :style="`background:${checkDoc.color}`"
                            class="docTage"
                          />
                        </div>
                      </div>
                    </div>
                  </el-card>
                  <!-- 每个文件的icon标签功能 -->
                  <el-row
                    v-if="list.backgroundCheck"
                    class="rectangleIcon"
                    type="flex"
                    justify="center"
                  >
                    <el-col
                      :span="item.icon == 'jeicon-more'?0:4"
                      v-for="(item, index) in list.docFunc"
                      :key="index"
                      class="docShow"
                    >
                      <el-tooltip
                        :transition="''"
                        :offset="-5"
                        :content="item.name"
                        effect="dark"
                        placement="top-end"
                      >
                        <i
                          @click.stop="listIconClick(item, list)"
                          v-if="!['jeicon-more','jeicon-label'].includes(item.icon)"
                          :class="item.icon"
                          class="jeicon font10 enuTrue"
                        />
                      </el-tooltip>
                      <!-- 文件标签的功能 -->
                      <el-tooltip
                        v-if="item.icon == 'jeicon-label'"
                        placement="right"
                        effect="light"
                      >
                        <div
                          slot="content"
                          class="checkTool"
                        >
                          <!-- 每个文件的标签 -->
                          <div
                            v-for="(check, check_index) in list.checkTag"
                            :key="check_index"
                            :style="`background:${check.color}`"
                            @click="docTagChange(check, check_index, list)"
                            class="checkTage"
                          >
                            <span
                              v-if="check.check"
                              class="checkTrue"
                            >√</span>
                          </div>
                        </div>
                        <i
                          :class="item.icon"
                          class="jeicon font10 enuTrue"
                        />
                      </el-tooltip>
                    </el-col>
                  </el-row>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <!-- 文件弹出框的组件 -->
      <dialogDoc
        :mainList="mainList"
        :checkData="checkNow"
        :nodeId="nodeId"
        :isDialog="dialogData"
        :getMenu="isMenu"
        @clsoeDialog="clsoeDialog"
        @changeMainList="changeMainList"
      />
      <mail
        ref="createMail"
        :cloudFile="mailList"
        @doCreate="doCreate"
      />
    </div>
  </div>
</template>

<script>
import { EventBus } from '../../common/eventBus';
import Mail from '../../../../modules/microMail/component/create';
import {
  getCheckArr, getCheckArrCompany, getNoAllCheckList, getCompanyCheckList,
  getArrStyle, isTypeData, menuClickCompany,
} from '../../common/util';
import * as Uploder from '../../common/uploader';
import List from '../../controllers/list/listController';
import AcceptList from '../../controllers/list/acceptController';
import RecordList from '../../controllers/list/recordController';
import RecoveryList from '../../controllers/list/recoveryController';
import { menuChangeData } from '../../model/testDocModel';
import DiskModel from '../../model/diskModel';
// 文件弹出框组件
import dialogDoc from '../common/dialog/index';

export default {
  components: {
    dialogDoc,
    Mail,
    // Tree,
  },
  props: {
    isMenu: Object,
    suffix: {
      type: Object,
      default: null,
    },
    tag: {
      type: Array,
      default: ['1'],
    },
    searchInput: {
      type: String,
      default: '',
    },
    dropFile: {
      type: Object,
      default: null,
    },
    firstMenu: {
      type: Object,
      default: {},
    },
    sildeSearch: {
      type: String,
      default: '',
    },
    closeProgress: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      checkNow: [], // 当前选中的数据
      checkAll: false, // 不确定选中状态
      isIndeterminate: false, // 是否改变选中的样式
      checkCompanyFile: null, // 当前双击文件夹之后的数据-
      checkFileShow: false, // 是否点击了面包屑的快速查找文件夹
      list: new List(),
      acceptList: new AcceptList(),
      recordList: new RecordList(),
      recoveryList: new RecoveryList(),
      mainList: [], // 列表数据
      dialogData: {
        isShow: false, // 是否显示弹框
        docEntr: 'add', // 默认是新建文件夹
        inputData: {}, // 修改文件的名称传递
        removeAll: '', // 是否是清空全部
      }, // 弹出框的数据
      breadCrumbArr: [
        { name: '返回上一级', id: '1', changename: '返回上一级' },
        { name: '全部文件', id: '2', changename: '全部文件' },
      ], // 面包屑数据(完整的面包屑数据)
      breadCrumbHint: [
        { name: '返回上一级', id: '1', changename: '返回上一级' },
        { name: '全部文件', id: '2', changename: '全部文件' },
      ], // 面包屑数据(面包屑数据大于5条的时候处理之后的数据)
      breadJurisdiction: false, // 是否显示面包屑的...
      nodeId: null, // 当前目录下的parentId
      params: {
        diskType: '',
        order: JSON.stringify([{ code: 'time', type: 'desc' }]),
        nodeType: '',
        parentId: null,
        tag: '',
        suffix: '',
        key: '',
      }, // 个人或者公司的搜索，这样写的目的就是为了减少代码的重复，
      defaultParam: {},
      uploadStop: [], // 当前正在上传要停止掉的文件
      sort: [{ code: 'time', type: 'desc' }], // 默认排序
      mailList: [],
      treeList: [],
      treeShow: false,
      breakShow: true,
      loadingMain: false, // 主要区域数据加载
      directorysList: [], // 成功上传的文件夹中的文件
    };
  },
  computed: {
    router() {
      let diskType = '';
      if (this.isMenu.router == '1-1') {
        diskType = 'company';
      }
      if (this.isMenu.router == '1-2') {
        diskType = 'self';
      }
      return diskType;
    },
  },
  watch: {
    sildeSearch(nv) {
      this.params.diskType = nv.diskType;
      this.params.parentId = nv.nodeId;
      this.params.nodeType = '';
      this.params.key = '';
    },
    // 面包屑的深度监听
    breadCrumbArr: {
      handler(nv) {
        this.changeBread(nv);
      },
      deep: true,
    },
    isMenu(nv) {
      // 当左侧的menu改变的时候，面包屑的处理，恢复默认数据
      this.breadCrumbArr.splice(2);
      this.nodeId = null;
      this.mainList = []; // 清空原来list数据
      this.checkNow = []; // 选中的checkbox要变为空数组
      this.isMenu.listTitle = menuChangeData(nv.router).title;
      // this.mainList = menuChangeData(nv.router).data;
      this._initCheck(nv.router);
    },
    suffix: {
      handler(nv) {
        const params = JSON.parse(JSON.stringify(this.params));
        params.suffix = nv.type.join(',');
        this.mainList = [];
        this.getList(params);
      },
      deep: true,
    },
    checkNow: {
      handler() {
        // 这边的处理就是当列表为空的时候，全选按钮也要变为false
        !this.checkNow.length && (this.checkAll = false);
      },
      deep: true,
    },
    tag: {
      handler(newVal) {
        const session = window.sessionStorage.getItem('diskType');
        if (session == '1-1' || session == '1-2') {
          this.params.tag = newVal.join(',');
          this.params.nodeType = '';
          // this.params.key = '';
        }
      },
      // 深度监听，可监听到对象、数组的变化
      deep: true,
    },
    firstMenu: {
      handler(newVal) {
        if (newVal.children) return false;
        if (newVal && newVal.title == '全部文件') {
          this.nodeId = null;
          this.breadCrumbArr.splice(2);
          this._initCheck(this.isMenu.router);
        } else {
          if (!newVal.title) return false;
          this.removeAllList(newVal);
        }
      },
      deep: true,
    },
    searchInput(newVal) {
      this.searchInput = newVal;
      if (this.isMenu.router == '1-1' || this.isMenu.router == '1-2') {
        this.params.key = newVal;
        this.params.nodeType = null;
      } else {
        this._initCheck(this.isMenu.router);
      }
    },
    params: {
      handler(newVal) {
        this.mainList = [];
        this.getList(newVal);
      },
      // 深度监听，可监听到对象、数组的变化
      deep: true,
    },
    async dropFile(nv) {
      if (nv) {
        await this.uploadFiles(nv, 'drop');
      }
    },
  },
  created() {
    this.defaultParam = { ...this.params };
  },
  async mounted() {
    this.$refs.createMail && (this.$refs.createMail.dialogVisible = false);
    EventBus.$on('NOW_OBJ', async (target) => {
      if (target.source == 'copy') return false;
      // if (this.nodeId == target.obj.nodeId) return false;
      this.checkCompanyFile = target.obj;
      this.checkFileShow = true;
      this.nodeId = target.obj.nodeId;
      // this.breadCrumbArr.push(target.obj);
      this.breadCrumbArr.splice(2);
      // this.nodeId = null;
      this.breakShow = false;
      const param = { ...this.params };
      param.parentId = target.obj.nodeId;
      param.nodeType = '';
      this.mainList = await this.list.initList(param);
    });
    EventBus.$on('directory', async (target) => {
      const res = await this.list.getUpFiles(this.nodeId, this.router, JSON.stringify(target.directoryPath));
      if (res.success) {
        target.directoryList.map((item) => {
          const pathList = res.obj.path;
          pathList.map((resItem) => {
            const key = Object.keys(resItem)[0];
            if (key == item.fullPath) {
              item.nodeId = resItem[key];
            }
          });
        });
        const dataList = res.obj.details || [];

        dataList.map((item) => {
          this.mainList.unshift(DiskModel.create(item));
        });
        await this.uploadFiles(target.directoryList, 'drop', 'dir');
      } else {
        this.dialogData.docEntr = 'repeat';
        this.dialogData.isShow = true;
        this.dialogData.roleData = res.message;
      }
    });
  },
  beforeDestroy() {
    // EventBus.$off('NOW_OBJ'.NOW_OBJ);
  },

  methods: {
    async getList(params) {
      this.mainList = await this.list.initList(params);
      this.loadingMain = false;
    },
    // 点击公司的操作(设置权限和操作记录)
    companySet(text, list) {
      // 设置权限
      this.dialogData.docEntr = text.status;
      this.dialogData.top = '15vh';
      this.checkNow.length = 0;
      this.checkNow.push(list);
      this.dialogData.isShow = true;
    },
    // 头部一级菜单的清除全部的功能
    removeAllList(data) {
      if (this.isMenu.router == 2) {
        this.mainList.forEach((main) => {
          this.uploadStop.push({ UUID: main.UUID });
        });
        this.mainList = [];
        JE.msg('成功清空所有上传');
        return false;
      }
      this.checkAllDoc(true);
      if (this.checkNow && this.checkNow.length == 0) return false;
      this.dialogData.removeAll = data.title;
      this.dialogData.docEntr = 'remove';
      // this.checkNow = JSON.parse(JSON.stringify(this.mainList));
      this.dialogData.isShow = true;
    },
    // 我发出分享的分享至xx的点击弹出框详情
    shargeOther(names) {
      this.dialogData.docEntr = 'share';
      this.dialogData.shareNames = names.split(',');
      this.dialogData.isShow = true;
    },
    // 点击列表上面的文件名或者是大小
    clickTitle(item) {
      if (item.type == 'name') {
        item.size = true;
        item.name = !item.name;
        this.sort = item.name ? [{ code: 'name', type: 'desc' }] : [{ code: 'name', type: 'asc' }];
        if (this.isMenu.router == '1-1' || this.isMenu.router == '1-2') {
          this.params.order = JSON.stringify(this.sort);
        } else {
          this._initCheck(this.isMenu.router);
        }
      }
      if (item.type == 'size') {
        item.size = !item.size;
        item.name = true;
        this.sort = item.size ? [{ code: 'size', type: 'desc' }] : [{ code: 'size', type: 'asc' }];
        if (this.isMenu.router == '1-1' || this.isMenu.router == '1-2') {
          this.params.order = JSON.stringify(this.sort);
        } else {
          this._initCheck(this.isMenu.router);
        }
      }
    },
    // 点击面包屑的item
    async clickBreadItem(item, index) {
      // 如果点击的是 ... 就返回，没有任何显示
      if (item.id == 'no') return;
      this.checkAll = false;
      this.checkNow.length = 0;
      // 最后一个不可点击
      if (index > 2 && this.breadCrumbArr.length == index + 1) {
        return false;
      }
      // 如果点击的是全部文件index = 1, 面包屑要要值为空;
      if (item.id == 2) {
        this.breadCommon();
      }
      if (item.id == 1) {
        const { length } = this.breadCrumbArr;
        if (length == 3) {
          this.breadCommon();
          return false;
        }
        const spliceItem = this.breadCrumbArr.splice(length - 1, 1);
        this.params.diskType = spliceItem[0].diskType;
        this.params.parentId = spliceItem[0].parent;
        this.nodeId = spliceItem[0].parent;
      }

      if (index >= 2) {
        let indexBread = index;
        this.breadJurisdiction && (indexBread = index + (this.breadCrumbArr.length - 7));
        this.nodeId = item.nodeId;
        this.breadCrumbArr.splice(indexBread + 1);
        this.params.diskType = item.diskType;
        this.params.parentId = item.nodeId;
      }
      this.params.suffix = ''; // 点击面包屑就去掉上面筛选过的尾缀
    },
    breadCommon() {
      this.$emit('searchEmpty'); // 清空搜索框的内容
      this.breadCrumbArr.splice(2);
      this.nodeId = null;
      console.log(this.params);
      this.params = this.defaultParam;
      if (this.isMenu.router == '1-1') {
        this.params.diskType = 'company';
      }
      if (this.isMenu.router == '1-2') {
        this.params.diskType = 'self';
      }
    },
    // 单击进行预览
    previewClick(doc) {
      if (doc.icon.icon != 'jeicon-folders') {
        // 个人文件 || 公司文件是管理或者编辑权限
        const power = (['1-2'].includes(this.isMenu.router) || ['manage', 'edit'].includes(doc.roleRoleCode));
        const type = power ? 'write' : 'read';
        doc.fileKey && JE.File.doAct('preview', '', '', doc.fileKey, doc.name, type);
      }
    },
    // 双击击文件的列表的文件进入下一层
    docClick(doc) {
      // 这边要有一个判断，就是如果是文件的话，需要进行预览，就不在调取接口
      if (!['1-1', '1-2'].includes(this.isMenu.router)) {
        // todo预览调柴昊接口
        JE.msg('只有个人文件和公司文件可以点击~');
        return false;
      }
      if (doc.icon.icon != 'jeicon-folders') {
        return false;
      }
      this.checkAll = false;
      this.checkNow.length = 0;
      this.checkCompanyFile = doc; // 当前文件目录的数据（主要用来判断公司文件的权限显示）
      this.isSecondMenu();
      // 如果是文件夹的话就需要进行处理
      this.breakShow = true;
      this.nodeId = doc.nodeId;
      this.parentPathName = `${doc.parentPathName}/${doc.name}`;
      doc.changename = doc.name.length > 5 ? `${doc.name.substring(0, 5)}...` : doc.name;
      this.breadCrumbArr.push(doc);
      // 双击的时候不再调用params的监听，因为全局搜索的key关键词会携带，所以要重新赋值不进行监听改变
      console.log('当前双击的内容', this.params);
      this.params = {
        diskType: this.params.diskType,
        key: '',
        nodeType: '',
        order: this.params.order,
        parentId: doc.nodeId,
        suffix: '',
        tag: '',
      };
      // this.params.parentId = doc.nodeId;
      // const newVal = JSON.parse(JSON.stringify(this.params));
      // newVal.key = '';
      // newVal.parentId = doc.nodeId;
      // this.getList(newVal);
    },
    // 如果面包屑数据超过5条就进行处理
    changeBread(data) {
      let dataJson = JSON.parse(JSON.stringify(data));
      this.searchInput && (dataJson = this.searchBreadInt(dataJson, this.searchInput));
      // 每次面包屑改变的时候让当前的文件夹权限进行赋值checkCompanyFile
      if (!this.checkFileShow) {
        data[data.length - 1].id != '2' && (this.checkCompanyFile = data[data.length - 1]) || (this.checkCompanyFile = null);
      }
      this.isSecondMenu(); // 每次面包屑改变之后从新判断是否显示二级菜单
      if (dataJson.length > 7) {
        dataJson.splice(2, 0, { name: '...', id: 'no', changename: '...' });
        this.breadJurisdiction = true;
        const dataLength = dataJson.length - 7;
        dataJson.splice(3, dataLength);
        this.breadCrumbHint = dataJson;
      } else {
        this.searchInput && (this.breadCrumbHint = dataJson);
        this.searchInput || (this.breadCrumbHint = data);
        this.breadJurisdiction = false;
      }
    },
    // 如果是搜索框联动的面包屑拦截处理
    searchBreadInt(bread, key) {
      bread.splice(0, 1);
      bread.splice(1, 0, { name: `关键词'${key}'的结果`, id: 'no', changename: `关键词'${key}'的结果` });
      return bread;
    },
    // 接收到子组件的新建文件夹方法
    async changeMainList(obj) {
      this.checkNow = []; // 让当前选中的数据为空
      if (obj.status == 'ok') {
        await this._initCheck(this.isMenu.router);
      } else if (obj.status != 'download') {
        this.mainList = obj.data;
        this.clsoeDialog(); // 恢复默认值
      }
      if (obj.status == 'remove' && this.isMenu.router == 2) {
        this.mainList.forEach((main) => {
          this.uploadStop.push({ UUID: main.UUID });
        });
        this.mainList = [];
        JE.msg('成功清空上传');
        return false;
      }
      this.isSecondMenu(); // 收到之后重新判断二级菜单的显示
    },
    // 列表的下拉菜单的操作方法
    changeAList(obj) {
      const data = this.isMenu.menuData.filter(item => obj.status == item.dialogText);
      const listA = obj.data;
      if (!data || !listA) return JE.msg('当前操作的方法中没有找到数组的title');
      this.checkNow = [];
      this.menuClick(data[0], listA, true);
    },
    // 列表的icon标签点击方法
    async listIconClick(obj, data) {
      // 如果是正在上传的Icon点击方法
      if (this.isMenu.router == '2') {
        this.uploadStop.push({ UUID: data.UUID });
        this.mainList = this.mainList.filter((main) => {
          if (main.UUID != data.UUID) return main;
        });
        JE.msg('取消上传');
        return false;
      }
      // 修改文件名
      if (obj.clickText == 'edit') {
        this.dialogData.docEntr = obj.clickText;
        this.dialogData.inputData = data;
        this.dialogData.isShow = true;
        return false;
      }
      // 回收站恢复和转存功能
      if (obj.clickText == 'recovery' || obj.clickText == 'receive') {
        this.dialogData.docEntr = obj.clickText;
        this.checkNow.length = 0;
        this.checkNow.push(data);
        this.dialogData.isShow = true;
        return false;
      }
      // if (obj.clickText != 'JE_User') return JE.msg('暂时只支持分享');
      const text = this.isMenu.menuData.filter(item => obj.clickText == item.dialogText);
      // 第三个参数证明是点击列表的icon的功能
      this.menuClick(text[0], data, true);
    },
    // // 列表的操作中的ICON点击方法
    // iconListClick(list) {
    //   // 如果是正在上传的删除方法
    //   if (this.isMenu.router == '2') {
    //     this.uploadStop.push({ UUID: list.UUID });
    //   }
    // },
    // 点击二级菜单的头部新建 上传 下载等
    async menuClick(title, checkNow, iconStatus) {
      if (!title.status && !iconStatus) return; // 如果该功能为亮起则禁止点击
      // 公司文件的二级菜单点击拦截功能, 如果权限不统一的话
      if (this.isMenu.router == '1-1') {
        // 拦截处理后的公司文件权限
        const companyMenu = menuClickCompany(title, checkNow, this.checkCompanyFile);
        if (companyMenu.status == 'noRole') {
          this.dialogData.isShow = true;
          this.dialogData.docEntr = 'noRole';
          this.dialogData.roleData = companyMenu;
          return;
        }
      }
      // 下面是同过公司权限拦截和不是公司文件的二级菜单点击的功能
      const checkIds = [];
      isTypeData(checkNow, 'Array') && checkNow.forEach((item) => {
        checkIds.push(item.nodeId);
      });
      isTypeData(checkNow, 'Object') && checkIds.push(checkNow.nodeId) && this.checkNow.push(checkNow);
      if (title.dialogText == 'upload') {
        await this.uploadFiles();
        return false;
      }
      if (title.dialogText == 'mail') {
        if (this.checkNow.length > 6) {
          JE.msg('最多可以选择6个文件');
          return false;
        }
        const checkMailList = this.checkNow.filter(item => !item.type);
        if (checkMailList.length) {
          JE.msg('文件夹类型不支持发送微邮');
          return false;
        }
        const nodeIds = getArrStyle('nodeId', this.checkNow);
        let diskType;
        this.isMenu.router == '1-2' && (diskType = 'self');
        this.isMenu.router == '1-1' && (diskType = 'company');
        const res = await this.list.goMicroMail(nodeIds, diskType);
        res.length && (this.$refs.createMail.dialogVisible = true) && (this.mailList = res);
        this.clsoeDialog();
        // 这边需要调取柴昊的接口，通过方法来获取文件的fileKey
        // 之后将这个值传给爽爽的微邮cloudFile，接口返回来的参数doCreate回调的事件目的是为了将弹窗隐藏
        return false;
      }

      // getArrStyle('paraid', list);
      // 如果是列表中的删除方法，直接调取接口不需要判断isTypeData(checkNow, 'Object')判断是否是列表的删除
      if (!title.status && isTypeData(checkNow, 'Array')) return;
      this.dialogData.docEntr = title.dialogText;

      this.dialogData.docEntr == 'JE_User' ? this.dialogData.isShow = false : this.dialogData.isShow = true;
      if (this.dialogData.docEntr == 'JE_User') {
        const that = this;
        JE.vue.selectUser({
          title: '',
          multiple: true,
          valueType: 'list',
          configInfo: ',,,M',
          callback(obj) {
            if (obj && obj.length > 200) {
              JE.msg('最多选中200个人分享~');
              return false;
            }
            that.clsoeDialog();
            const idList = [];
            const names = [];
            obj.map((item) => {
              idList.push(item.id);
              names.push(item.text);
            });
            that.fileShare(checkIds, idList, names);
          },
        });
      }
    },
    // 微邮发送成功,弹框要消失
    doCreate() {
      this.$refs.createMail.dialogVisible = false;
      this.clsoeDialog();
    },
    /*
     * 文件分享
     * @return:
     */
    async fileShare(checkIds, idList, names) {
      await this.list.filesByShare(checkIds, idList, names);
      this.clsoeDialog();
    },
    // 关闭弹出框
    clsoeDialog() {
      this.checkNow.length = 0; // 清空选中
      this.checkAll = false;
      this.isSecondMenu();
      this.dialogData = {
        isShow: false, // 是否显示弹框
        docEntr: '', // 默认是新建文件夹
        inputData: {}, // 修改文件的名称传递
        removeAll: '', // 是否是清空全部
      };
      this.mainList = this.mainList.filter((data) => {
        data.checkbox = false;
        return data;
      });
    },
    // 初始化checkAll的数据
    async _initCheck(router) {
      this.loadingMain = true; // 区域加载显示
      switch (router) {
        case '1-1':

          // 公司文件
          this.params = { ...this.defaultParam };
          this.params.diskType = 'company';
          this.params.parentId = null;
          this.params.key = '';
          this.params.suffix = '';
          // type ? this.params.nodeType = 'dir' : this.params.nodeType = '';
          this.$emit('searchEmpty');
          break;
        case '1-2':
          // 个人文件
          this.params = { ...this.defaultParam };
          this.params.diskType = 'self';
          this.params.parentId = null;
          this.params.key = '';
          this.params.suffix = '';
          // type ? this.params.nodeType = 'dir' : this.params.nodeType = '';
          this.$emit('searchEmpty');
          break;
        case '1-3':
          // 我发出的分享
          this.mainList = await this.acceptList.sendShareList(this.searchInput, this.sort);
          this.loadingMain = false;
          break;
        case '1-4':
          // 我收到的分享
          this.mainList = await this.acceptList.reciveShareList(this.searchInput, this.sort);
          this.loadingMain = false;
          break;
        case '2':
          // 正在上传
          this.mainList = JSON.parse(sessionStorage.getItem('docUploadArr')) || [];
          this.loadingMain = false;
          break;
        case '3':
          // 传输记录
          this.mainList = await this.recordList.initList(this.searchInput, this.sort);
          this.loadingMain = false;
          break;
        case '5':
          // 回收站
          this.mainList = await this.recoveryList.recoveryList(this.searchInput, this.sort);
          this.loadingMain = false;
      }
    },
    // 拿到父组件传递过来的选中菜单，改变当前页面的数据显示
    _initIsMenu(data) {
      switch (data) {
        case '2':
          this._uploadTime();
          break;
      }
    },
    // 如果点击的是正在上传执行的方法
    _uploadTime() {
      this.menuData = [{
        text: '全部删除',
        icon: 'jeicon-trash-o',
        status: false,
      }];
    },
    // 鼠标移入指定元素改变相应的背景颜色
    backgroundRow(list, index) {
      this.mainList = this.mainList.map((main, mainIndex) => {
        if (mainIndex == index) {
          main.backgroundCheck = true;
        } else {
          main.backgroundCheck = false;
        }
        return main;
      });
    },
    // 点击全选
    checkAllDoc(val) {
      // 对公司文件进行单独过滤，需要考虑查看权限的文件的选中功能
      if (this.isMenu.router == '1-1') {
        this.mainList = getCheckArrCompany(val, this.mainList, 'checkbox');
        this.checkNow = val ? JSON.parse(JSON.stringify(this.mainList.filter(company => company.roleRoleCode != 'check'))) : [];
      } else {
        this.mainList = getCheckArr(val, this.mainList, 'checkbox');
        this.checkNow = val ? JSON.parse(JSON.stringify(this.mainList)) : [];
      }
      val && (this.checkAll = true);
      this.isSecondMenu();
    },
    // 选中文档的复选框
    checkList(list, index) {
      // 如果是公司文件需要进行单独处理过滤，因为只有查看功能的数据不可选中
      if (this.isMenu.router == '1-1') {
        const checkData = getCompanyCheckList(list, this.checkNow, 'checkbox', index, this.mainList);
        this.checkNow = checkData.checkList;
        this.checkAll = checkData.checkAll;
        this.isSecondMenu();
        return;
      }
      this.checkNow = getNoAllCheckList(list, this.checkNow, 'checkbox', index);
      this.checkNow.length == this.mainList.length ? (this.checkAll = true) : (this.checkAll = false);
      this.isSecondMenu();
    },
    // 判断是否显示二级菜单
    isSecondMenu() {
      // 需要传2个值
      // 对于二级菜单而言，只有个人或者公司才有 别的地方没有
      // if (this.isMenu.router == '1-1' || this.isMenu.router == '1-2') {

      // }
      this.isMenu.menuData = this.list.getSecondMenu(this.isMenu, this.checkNow, this.checkCompanyFile);
    },
    // 当前选中的标签改变的选中的对勾
    async docTagChange(checks, checkIndex, list) {
      const newTag = JSON.parse(JSON.stringify(list.checkTag));
      newTag[checkIndex].check = !checks.check;
      const tagArr = []; // 当前下标
      newTag.forEach((item, item_) => {
        if (item.check) {
          tagArr.push(item_ + 1);
        }
      });
      // console.log(checks, this.mainList, checkIndex, list);
      // const index_ = []; // 当前下标
      // const nodeArr = list.nodeTag && list.nodeTag.split(',') || [];
      // const checkVal = !checks.check;
      // nodeArr.push(checkIndex + 1);

      const diskType = this.isMenu.router == '1-1' ? 'company' : 'self';
      await this.list.editFileTag(list.nodeId, (tagArr.join(',')), diskType);
      this.$set(list.checkTag[checkIndex], 'check', !checks.check);
    },
    async uploadFiles(drop, type, fileType) {
      if (window.performance && ('msDoNotTrack' in window.navigator)) {
        JE.alert('ie9浏览器暂不支持上传，请切换高版本浏览器');
        return false;
      }
      const that = this;
      const params = {
        nodeId: this.nodeId || '',
        diskType: this.isMenu.router == '1-1' ? 'company' : 'self',
        multiple: true,
        fileType,
        structure: JSON.stringify(this.directoryList),
        parentPathName: this.nodeId ? this.parentPathName : '根目录',
        callback(data) {
          // 如果上传接口报错，传输文件失败的话
          // if (data.err) {
          //   let arr = JSON.parse(sessionStorage.getItem('docUploadArr'));
          //   arr = arr.filter((arrFilter) => { that.uploadStop.some(uploadNo => arrFilter.UUID != uploadNo.UUID); });
          //   sessionStorage.setItem('docUploadArr', JSON.stringify(arr));
          //   that.$emit('uploadChange', 'change');
          //   return false;
          // }
          let arr = JSON.parse(sessionStorage.getItem('docUploadArr'));
          arr = arr.filter((arrFilter) => { that.uploadStop.some(uploadNo => arrFilter.UUID != uploadNo.UUID); });
          sessionStorage.setItem('docUploadArr', JSON.stringify(arr));
          that.$emit('uploadChange', 'change');
          if (!data.success) {
            return that.$notify({
              title: '失败',
              message: `${data.message}`,
              type: 'warning',
              duration: 2000,
            });
          }
          // 上传结束，接口回调
          Uploder.uploadEnd(data);
          that.isMenu.router == '2' && that._initCheck('2');// 每次改变都变化进度条
          // that.params = { ...that.defaultParam };
          // that.params.parentId = that.nodeId;
          // that.params.diskType = that.isMenu.routerText;

          const _data = data.obj[0];
          that.$notify({
            title: '成功',
            message: `${_data.nodeName}上传完成`,
            type: 'success',
            duration: 2000,
          });
          if (fileType == 'dir') return false;
          const item = DiskModel.create(_data);
          that.isMenu.router == '3' && that.mainList.unshift(item);
          if (item.diskType == that.router) {
            if (!that.nodeId && item.parentPathName == '/根目录') {
              that.mainList.unshift(item);
            }
            if (that.nodeId == item.parent) {
              that.mainList.unshift(item);
            }
          }
          that.clsoeDialog(); // 恢复默认值
        },
        progress(res, file, pathName) {
          // 进度条实现的逻辑res是进度条的最新进度    file是文件的基本信息   UUID是文件的唯一标识
          // 上传中的数据
          Uploder.uploadingFunc({
            res, file, pathName,
          });
          // 如果关闭弹框之后删除掉进度条和上传暂停
          if (that.closeProgress) {
            this.abort();
            sessionStorage.removeItem('docUploadArr');
            return;
          }
          // 如果删除正在上传的数据
          if (that.uploadStop.length > 0) {
            let arr = JSON.parse(sessionStorage.getItem('docUploadArr'));
            arr = arr.filter((arrFilter) => { that.uploadStop.some(uploadNo => arrFilter.UUID != uploadNo.UUID); });
            that.uploadStop = that.uploadStop.filter((uploadNo) => {
              if (uploadNo.UUID == file.uuid) {
                this.abort();
              } else {
                return uploadNo.UUID;
              }
            });
            sessionStorage.setItem('docUploadArr', JSON.stringify(arr));
          }
          that.$emit('uploadChange', 'change');
          that.isMenu.router == '2' && that._initCheck('2');// 每次改变都变化进度条
        },
      };
      type && (params.path = drop);
      Uploder.uploadFile(params, type);
    },
  },
};

</script>
<style lang='scss' scoped>
@import "./index.scss";
</style>
<style lang="scss">
@import "./eleMenu.scss";
</style>
